<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="lib :: common_header"></head>
<body>
<div th:replace="lib :: header_box"></div>
<div th:replace="lib :: menu_box (3)"></div>

<div class="main-box" v-model="userchoose">
    <div class="main-container">
        <!-- 面包屑导航 -->
        <div class="row main-container-header">
            <div class="col-md-12 rel">
                <div class="main-container-header-line fix">
                    <div class="row">
                        <div class="col-xs-6 col-md-6"> <h4 class="g4"> <a class="a-back" href="javascript:history.go(-1)"><em class="el-icon-arrow-left"></em>
                            <em th:text="${title}"></em>
                        </a></h4></div>
                        <div class="col-xs-6 col-md-6 tr f12">
                            <div class="bread-link-box">
                                当前位置：<a th:href="@{/console/project}">项目管理</a>
                                &nbsp;&gt;&nbsp;
                                <em th:text="${title}"></em>
                            </div><!-- /bread-link-box -->
                        </div>
                    </div><!-- /row -->
                </div><!-- main-container-header-line -->
            </div>
        </div><!-- /main-container-header -->

        <div class="f14" id="app" v-cloak>
            <br>
            <div class="row">
                <div class="col-sm-8" style="width:600px;">
                    <template>
                        <el-form :model="projectForm" :rules="projectRules" ref="projectForm" label-width="130px">
                            <el-form-item label="项目名称" prop="name">
                                <el-input v-model="projectForm.name"></el-input>
                            </el-form-item>
                            <el-form-item label="项目类型" prop="type">
                                <el-select v-model="projectForm.type" placeholder="请选择">
                                    <el-option
                                            v-for="item in projectTypes"
                                            :key="item.value"
                                            :label="item.label"
                                            :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="研究方向" prop="rcontext">
                                <el-input v-model="projectForm.rcontext"
                                          placeholder="请输入研究方向">
                                </el-input>
                            </el-form-item>
                            <el-form-item label="联系人" prop="contact_name">
                                <el-col :span="11">
                                    <el-input v-model="projectForm.contact_name"
                                              placeholder="请选择联系人"
                                              :readonly="true">
                                    </el-input>
                                </el-col>
                                <el-col :span="11"> &nbsp;&nbsp;
                                    <el-button class="btn btn-default"
                                            icon="el-icon-search"
                                            @click="getUser(userPageNo, userPageSize)">
                                        检索联系人
                                    </el-button>
                                </el-col>
                            </el-form-item>
                            <el-form-item label="项目状态" prop="status">
                                <el-select v-model="projectForm.status" placeholder="请选择">
                                    <el-option
                                            v-for="item in projectStatus"
                                            :key="item.value"
                                            :label="item.label"
                                            :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="备注" prop="memo">
                                <el-input v-model="projectForm.memo"
                                          type="textarea"
                                          :rows="4"
                                          placeholder="请输入备注">
                                </el-input>
                            </el-form-item>
                            <el-form-item>
                                <div>
                                    <el-button @click="javascript:history.go(-1)">
                                        取 消
                                    </el-button>

                                    <el-button type="primary"
                                               @click="saveProject()">
                                        确 定
                                    </el-button>
                                </div>
                            </el-form-item>
                        </el-form>
                    </template>
                </div><!-- /col -->
            </div><!-- /row -->

            <!-- 用户信息 -->
            <el-dialog
                    title="用户列表"
                    :visible.sync="dialogVisible"
                    width="600px">
                <div class="row">
                    <el-form label-width="60px" inline="true">
                        <el-form-item label="姓名">
                            <el-input v-model="personName"></el-input>
                        </el-form-item>
                        <el-form-item label="账号">
                            <el-input v-model="puserName"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="default" @click="getUserbycondition(userPageNo,userPageSize)">查询</el-button>
                        </el-form-item>
                    </el-form>
                </div><!-- /row -->
                <div class="row">
                    <div class="col-sm-12">
                        <div class="mt10">
                            <el-table
                                    ref="userTable"
                                    :data="userData"
                                    border
                                    :highlight-current-row="true"
                                    @row-click="chooseUser"
                                    style="width: 100%">
                                <el-table-column prop="username"
                                                 label="账号"
                                                 min-width="15%"></el-table-column>
                                <el-table-column prop="name"
                                                 label="姓名"
                                                 min-width="20%"> </el-table-column>
                                <el-table-column prop="email"
                                                 label="邮件"
                                                 min-width="20%"> </el-table-column>
                                <!--
                                <el-table-column prop="status"
                                                 label="当前状态"
                                                 min-width="10%">
                                    <template slot-scope="scope">
                                        {{ scope.row.status | changeuserStatus }}
                                    </template>

                                </el-table-column>
                                <el-table-column prop="created"
                                                 label="注册时间"
                                                 min-width="20%"> </el-table-column>
                                <el-table-column prop="orgname"
                                                 label="所属会员"
                                                 min-width="15%"> </el-table-column>
                                                 -->
                            </el-table>

                            <div class="block mt10 tr">
                                <el-pagination
                                        small
                                        layout="prev, pager, next"
                                        :page-size="userPageSize"
                                        :total="userDataFromDB.length"
                                        v-on:current-change="handleUserPageChange">
                                </el-pagination>
                            </div>
                        </div>
                    </div><!-- /col -->
                </div><!-- /row -->
            </el-dialog>

        </div><!-- /app -->
    </div>
</div>
<div th:replace="lib :: javascript_box"></div>
<script> var id = '[[${id}]]'; </script>
<script th:src="@{/lib/console/project_add.js}"></script>
</body>
</html>

